<template>
	<section>
		<!--start  面包屑-->
	    <div class="location">
	      <el-breadcrumb separator="/">
	        <el-breadcrumb-item :to="{path:'/index'}">首页</el-breadcrumb-item>
	        <el-breadcrumb-item :to="{path:'/enterprise'}">企业客户</el-breadcrumb-item>
	        <el-breadcrumb-item :to="{path:'/enterprise'}">企业客户列表</el-breadcrumb-item>
	        <el-breadcrumb-item>修改企业客户</el-breadcrumb-item>
	      </el-breadcrumb>
	     	<help-components>
				<span slot="headText">{{helpData.templateName}}</span>
				<p slot="headDescText" v-html="helpData.templateRemark"></p>
				<div slot="helpContentWrap">
					<div v-for="(item,index) in helpData.questionAndAnswerArray">
						<h3>{{item.templateContent}}</h3>
						<p v-html="item.templateRemark"></p>
					</div>
				</div>
			</help-components>
	    </div>
	     <!--start content-->
   		 <div class="content" id="content">
   		 	<!--重置密码-->
   		 		<div class="add">
				<transition name="fade">
					<div class="modal-backdrop" v-show="add"></div>
				</transition>
				<transition name="slideDown">
					<div class="specific-search" v-show="add">
						<div class="search-title">
							<p>重置密码</p>
						</div>
						<div class="form">
							<ul class="accoUL accoULzhang">
			   		 			<li>
			   		 				<em class="iconfont">&#xe708;</em><span>账号</span><input id="str" v-model="basicMemberCompanyData.operatorAccount" disabled="disabled" style="cursor: no-drop;background: #eff1f8;" />
			   		 			</li>
			   		 			<li>
			   		 				<em class="iconfont">&#xe708;</em><span>密码</span><input type="password" v-model="basicMemberCompanyData.operatorLoginPassword" @blur="inpasswd"/>
			   		 				<p v-if="inpaww" style="text-align: left;text-indent: 80px;">密码为6-20位字母或数字！</p>
			   		 			</li>
			   		 			<li>
			   		 				<em class="iconfont">&#xe708;</em><span>重复密码</span><input type="password" v-model="restwo" @blur="inpasstwo" />
			   		 				<p v-if="intwo" style="text-align: left;text-indent: 80px;">两次密码必须一至！</p>
			   		 			</li>
			   		 		</ul>
						</div>
						<div class="search-btn">
							<el-button type="primary" @click="psatijiao">确定</el-button>
							<el-button @click="add=false">取消</el-button>
						</div>
					</div>
				</transition>
			</div>

   		 	<h2 style="color: #03b8cc;font-weight: normal;">公司信息</h2>
   		 	<div class="gosi-dox">
	   		 	<div class="gosi-left1">
	   		 		<ul>
   		 				<li>
		   		 			<em class="iconfont">&#xe708;</em><span>客户名称</span>
		   		 			<input class="inptwid" type="text" v-model="basicMemberCompanyData.memberName" @blur="namenull2" /><br>
		   		 			<p v-if="goName" style="text-align: left;text-indent: 100px;color: #ff4949;">客户名称不能为空！</p>
		   		 		</li>
		   		 		<li>
		   		 			<em class="iconfont">&#xe708;</em><span>归属区域</span>
		   		 			<el-select v-model="basicMemberCompanyData.regionCode" placeholder="请选择归属区域">
					      		<el-option
							        v-for="item in options2"
							        :key="item.regionCode"
							        :label="item.regionName"
							        :value="item.regionCode">
							    </el-option>
						    </el-select>
		   		 			<p v-if="guishuquyu" style="text-align: left;text-indent: 100px;color: #ff4949;">归属地不能为空！</p>
		   		 		</li>
		   		 		<!--<li>
		   		 			<span>签约时间</span>
		   		 			<el-date-picker
						      v-model="signDate"
						      type="daterange"
						      placeholder="选择日期范围">
						    </el-date-picker>
		   		 		</li>-->
		   		 		<li>
		   		 			<span>所在地区</span>
			   		 			<el-cascader
			   		 				class="selectWidth"
			   		 				popper-class="kael"
			   		 				:options="detailedAreaList"
			   		 				@change="areaChangeFn"
			   		 				v-model="basicMemberCompanyData.areaCode"
			   		 				:props="areaProps">
								</el-cascader>
		   		 		</li>
   		 			</ul>
	   		 	</div>
	   		 	<div class="gosi-left1">
	   		 		<ul>
		   		 		<li>
		   		 			<em class="iconfont">&#xe708;</em><span>客户级别</span>
		   		 			<el-select v-model="basicMemberCompanyData.gradeCode" placeholder="请选择客户及别">
					      		<el-option
							        v-for="item in options"
							        :key="item.gradeCode"
							        :label="item.gradeName"
							        :value="item.gradeCode">
							    </el-option>
						    </el-select>
		   		 			<!--<p v-if="inname" style="text-align: left;text-indent: 80px;color: #ff4949;">姓名不能为空！</p>-->
		   		 		</li>
		   		 		<li class="qiyekehuli">

		   		 			<span>邮编</span>
		   		 			<input  type="text" v-model="basicMemberCompanyData.operatorPostCode"  />
		   		 			<!--<p v-if="inname" style="text-align: left;text-indent: 80px;color: #ff4949;">姓名不能为空！</p>-->
		   		 			<span>传真</span>
		   		 			<input  type="text" v-model="basicMemberCompanyData.companyFax"  />
		   		 			<!--<p v-if="inname" style="text-align: left;text-indent: 80px;color: #ff4949;">姓名不能为空！</p>-->
		   		 		</li>
		   		 		<li>
		   		 			<span>详细地址</span>
		   		 			<input class="inptwid" type="text" v-model="basicMemberCompanyData.companyAddress"  /><br>
		   		 		</li>


   		 			</ul>
	   		 	</div>
   		 	</div>
   		 	<div class="personal">
   		 		<h2 style="color: #03b8cc;font-weight: normal;">管理员信息</h2>
   		 		<div class="per-left">
   		 			<ul>
   		 				<li>
		   		 			<em class="iconfont">&#xe708;</em><span>姓名</span>
		   		 			<input class="inptwid" type="text" v-model="basicMemberCompanyData.operatorName" @blur="namenull" /><br>
		   		 			<!---->
		   		 			<p v-if="!basicMemberCompanyData.operatorName" style="text-align: left;text-indent: 80px;color: #ff4949;">姓名不能为空！</p>
		   		 		</li>
		   		 		<li>
		   		 			<span>电话</span>
		   		 			<input class="inptdun" type="text" v-model="basicMemberCompanyData.operatorTel" style="margin-right: 37px;" />
		   		 			<span>QQ</span>
		   		 			<input class="inptdun" type="text" v-model="basicMemberCompanyData.operatorQq" @keyup="varQq"/>
		   		 			<p v-if="oQq" style="text-align: left;text-indent: 365px;color: #ff4949;position: absolute;">请输入正确QQ</p>
		   		 		</li>
		   		 		<li style="text-align: left;margin-left:37px;">
		   		 			<span>Email</span>
		   		 			<input class="inptdun" type="text" v-model="basicMemberCompanyData.operatorEmail" @keyup="valemail" />
		   		 			<p v-if="oemail" style="text-align: left;text-indent: 40px;color: #ff4949;position: absolute;">请输入正确邮箱</p>
   		 				</li>
   		 			</ul>
   		 		</div>
   		 		<div class="per-right">
   		 			<span>头像</span>
   		 			<el-upload
					    class="avatar-uploader"
					    :class="{uploading:headerImg.uploading}"
					    :action="uploadUrl"
					    :data="headerImg.updata"
					    :show-file-list="false"
					    :on-success="handleAvatarSuccess"
					    :on-error="handleAvatarError"
					    :before-upload="beforeAvatarUpload">
					    <img v-if="headerImg.imgSrc||headerImg.isImgSrc" :src="headerImg.imgSrc" class="avatar">
				    	<i v-else class="avatar-uploader-icon" :class="{'el-icon-plus':!headerImg.uploading,'el-icon-loading':headerImg.uploading}"></i>
					</el-upload>
   		 		</div>
   		 	</div>
   		 	<div class="persZh">
   		 		<div class="shenfen">
   		 			<span class="perSpan">身份证正面</span>
   		 			<el-upload
					    class="avatar-shenfen-uploader avatar-uploader"
					    :action="uploadUrl"
					    :data="certificateImg1.updata"
					    :show-file-list="false"
					    :on-success="handleAvatarSuccess1"
					    :on-error="handleAvatarError1"
					    :before-upload="beforeAvatarUpload1">
					    <img v-if="certificateImg1.isImgSrc||certificateImg1.imgSrc" :src="certificateImg1.imgSrc" class="avatar">
				    	<i class="avatar-uploader-icon el-icon-plus" v-else></i>
					</el-upload>
   		 		</div>
   		 		<div class="">
   		 			<img src="../../../img/u676.png" />
   		 		</div>
   		 	</div>
   		 	<div class="persZh">
   		 		<div class="shenfen">
   		 			<span class="perSpan">身份证反面</span>
   		 			<el-upload
					    class="avatar-shenfen-uploader avatar-uploader"
					    :action="uploadUrl"
					    :data="certificateImg2.updata"
					    :show-file-list="false"
					    :on-success="handleAvatarSuccess2"
					    :on-error="handleAvatarError2"
					    :before-upload="beforeAvatarUpload2">
					    <img v-if="certificateImg2.isImgSrc||certificateImg2.imgSrc" :src="certificateImg2.imgSrc" class="avatar">
				    	<i class="avatar-uploader-icon el-icon-plus" v-else></i>
					</el-upload>
   		 		</div>
   		 		<div class="">
   		 			<img src="../../../img/u678.png" />
   		 		</div>
   		 	</div>
         <div class="persZh">
           <div class="shenfen">
             <span class="perSpan">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名&nbsp;&nbsp;&nbsp;&nbsp;片</span>
             <el-upload
               class="avatar-shenfen-uploader avatar-uploader"
               :action="uploadUrl"
               :data="certificateImg7.updata"
               :show-file-list="false"
               :on-success="handleAvatarSuccess7"
               :on-error="handleAvatarError7"
               :before-upload="beforeAvatarUpload7">
               <img v-if="certificateImg7.isImgSrc||certificateImg7.imgSrc" :src="certificateImg7.imgSrc" class="avatar">
               <i class="avatar-uploader-icon el-icon-plus" v-else></i>
             </el-upload>
           </div>
         </div>
   		 	<div class="account">
   		 		<h2 style="color: #03b8cc;font-weight: normal;">账号信息</h2>
   		 		<ul class="accoUL">
   		 			<li>
   		 				<em class="iconfont">&#xe708;</em><span>手机</span>
		   		 		<input class="inptdun" type="text" v-model="basicMemberCompanyData.operatorPhone"  @blur="yanshouji" disabled="disabled" style="cursor: no-drop;background: #eff1f8;"  />
		   		 		<p v-if="inphone" style="text-align: left;text-indent: 80px;color: #f50;position: absolute;">手机格式不正确</p>
   		 			</li>
   		 			<li>
   		 				<em class="iconfont">&#xe708;</em><span>账号</span>
   		 				<input id="str" v-model="basicMemberCompanyData.operatorAccount" disabled="disabled" style="cursor: no-drop;background: #eff1f8;" />
   		 			</li>

   		 			<li class="accoUL-li">
   		 				<a style="cursor: pointer;" @click="add=true">重置密码</a>
   		 			</li>
   		 		</ul>
   		 	</div>
   		 	<div class="caiwu">
   		 		<h2 style="color: #03b8cc;font-weight: normal;">财务信息</h2>
   		 		<ul class="accoUL" style="float: left;width: 578px;">
   		 			<li>
   		 				<span>开户名称</span><input v-model="basicMemberCompanyData.operatorInvoiceNane"/>
   		 			</li>
   		 			<li>
   		 				<span>银行账号</span><input v-model="basicMemberCompanyData.operatorInvoiceAccount"/>
   		 			</li>
   		 			<li>
   		 				<span>发票抬头</span><input v-model="basicMemberCompanyData.operatorInvoiceTitle"/>
   		 			</li>
   		 		</ul>
   		 		<ul class="accoUL" style="float: left;width: 580px;">
   		 			<li>
   		 				<span>开户银行</span><input v-model="basicMemberCompanyData.operatorInvoiceBank"/>
   		 			</li>
   		 			<li>
   		 				<span>纳税人识别号</span><input v-model="basicMemberCompanyData.operatorInvoiceTaxId"/>
   		 			</li>
   		 		</ul>
   		 	</div>
   		 	<div class="personal">
   		 		<h2 style="color: #03b8cc;font-weight: normal;">三证上传</h2>
   		 		<template>
				  <el-tabs v-model="activeName">
				    <el-tab-pane label="老板三证" name="first">
				    <div class="sanzheng">
	   		 			<div class="persZh" style="margin-left: 86px;">
		   		 			<div class="shenfen">
			   		 			<span class="perSpan">营业执照</span>
			   		 			<el-upload
								    class="avatar-shenfen-uploader avatar-uploader"
								    :action="uploadUrl"
								    :data="certificateImg3.updata"
								    :show-file-list="false"
								    :on-success="handleAvatarSuccess3"
								    :on-error="handleAvatarError3"
								    :before-upload="beforeAvatarUpload3">
								    <img v-if="certificateImg3.isImgSrc||certificateImg3.imgSrc" :src="certificateImg3.imgSrc" class="avatar">
							    	<i v-else class="avatar-uploader-icon el-icon-plus"></i>
								</el-upload>
			   		 		</div>
			   		 	</div>
			   		 	<div class="persZh" style="margin-left: 74px;">
			   		 		<div class="shenfen">
			   		 			<span class="perSpan">税务登记证</span>
			   		 			<el-upload
								    class="avatar-shenfen-uploader avatar-uploader"
								    :action="uploadUrl"
								    :data="certificateImg4.updata"
								    :show-file-list="false"
								    :on-success="handleAvatarSuccess4"
								    :on-error="handleAvatarError4"
								    :before-upload="beforeAvatarUpload4">
								    <img v-if="certificateImg4.isImgSrc||certificateImg4.imgSrc" :src="certificateImg4.imgSrc" class="avatar">
							    	<i v-else class="avatar-uploader-icon el-icon-plus"></i>
								</el-upload>
			   		 		</div>
			   		 	</div>
			   		 	<div class="persZh" style="margin-left: 50px;">
			   		 		<div class="shenfen">
			   		 			<span class="perSpan">组织机构代码证</span>
			   		 			<el-upload
								    class="avatar-shenfen-uploader avatar-uploader"
								    :action="uploadUrl"
								    :data="certificateImg5.updata"
								    :show-file-list="false"
								    :on-success="handleAvatarSuccess5"
								    :on-error="handleAvatarError5"
								    :before-upload="beforeAvatarUpload5">
								    <img v-if="certificateImg5.isImgSrc||certificateImg5.imgSrc" :src="certificateImg5.imgSrc" class="avatar">
							    	<i v-else class="avatar-uploader-icon el-icon-plus"></i>
								</el-upload>
			   		 		</div>
			   		 	</div>
	   		 		</div>
				    </el-tab-pane>
				    <el-tab-pane label="新版三证" name="second">
				    	<div>
			   		 		<div class="persZh persan">
			   		 			<div class="shenfen">
				   		 			<span class="perSpan">三证合一</span>
				   		 			<el-upload
									    class="avatar-shenfen-uploader avatar-uploader"
									    :action="uploadUrl"
									    :data="certificateImg6.updata"
									    :show-file-list="false"
									    :on-success="handleAvatarSuccess6"
									    :on-error="handleAvatarError6"
									    :before-upload="beforeAvatarUpload6">
									    <img v-if="certificateImg6.isImgSrc||certificateImg6.imgSrc" :src="certificateImg6.imgSrc" class="avatar">
								    	<i v-else class="avatar-uploader-icon el-icon-plus"></i>
									</el-upload>
				   		 		</div>
				   		 	</div>
			   		 	</div>
				    </el-tab-pane>
				  </el-tabs>
				</template>



   		 	</div>
   		 	<div class="queren">
   		 		<el-button type="primary" :disabled="clickBtn"  @click="update">保存</el-button>
          <el-button @click="$router.push({path:'/enterprise'})">取消</el-button>
   		 	</div>

   		 </div>
   		 <!--end content-->
	</section>
</template>
<script>
	import * as companyMsgDatas from '../../../assets/data/companyMsgData';
	import helpComponents from '../../../components/help/help'
	export default {
		components:{helpComponents},
		data() {
			return {
        clickBtn:false,                 //请求数据后禁用按钮
				helpData:{
					templateName:"",
					templateRemark:"",
					questionAndAnswerArray:[]
				},
				uploadData:{},
				options2:[],
	        	/* start upload */
	        	uploadUrl:"/v3/misc/common/uploadFile",

	        	headerImg:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	certificateImg1:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	certificateImg2:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
        certificateImg7:{
          updata:{
            "moduleName":"basic",
            "fileName":""
          },
          imgSrc:"",
          isImgSrc:false,
          uploading:false,
          canUpload:true
        },
	        	certificateImg3:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	certificateImg4:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	certificateImg5:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	certificateImg6:{
	        		updata:{
	        			"moduleName":"basic",
						"fileName":""
	        		},
	        		imgSrc:"",
	        		isImgSrc:false,
					uploading:false,
					canUpload:true
	        	},
	        	/* end upload */
				guishuquyu:false,						//归属区域不能为空
	        	goName:false,							//公司名称是否为空
	        	activeName: 'first',					// 证件切换
				activeName: 'first',					//证件切换
				radio: '1',
				imageUrl: '',
				dialogImageUrl: '',
				dialogVisible: false,
				checked: true,
				inpu: false,
				ovalue: '',
				disa: '', 						//身份正面禁用
				disa2: '', 						//身份反面禁用
				add: false,
				operatorLoginPassword: '', 		//密码
				restwo: '', 					//确认密码
				inpaww: false,
				intwo: false,
				inphone: false, 				//手机格式是否正确
				qunbu: true, 					//必须输入的信息
				oemail:false,					// 验证邮箱
	        	oQq:false,						// 验证QQ
				modifData: [],
				memberName: '', 				//客户姓名
				operatorPhone: '', 				//手机
				operatorTel: '', 				//电话
				operatorQq: '',				 	//qq
				operatorEmail: '', 				//邮箱
				operatorAccount: '', 			//账户
				positio: '', 					//职位
				jibie: '', 						//级别
				acctName: '', 					//开户名称
				acctBank: '', 					//开户银行
				bankno: '', 					//银行账号
				Taxpayer: '', 					//纳税人识别号
				invoice: '', 					//发票抬头
				signDate : [],			    	// 签约时间
				options: [],

				operatorCode:'',
				basicMemberCompanyData:{
					memberCode :'',						// 会员代码
					memberName : '',					// 会员名称
					gradeCode: '', 						// 等级
					memberGrade : '',					// 会员等级
					regionCode : '',					// 归属区域
					signDate : 'null',					// 签约时间
					operatorName : '',					// 姓名
					operatorCode : '',					// 操作员代码
					operatorTel : '',					// 电话
					operatorQq : '',					// QQ
					operatorEmail : '',					// 邮箱
					operatorPhone : '',					// 手机
					operatorAccount : '',				// 登录账号
					operatorLoginPassword : '',			// 登录密码
					operatorInvoiceNane : '',			// 开户名称
					operatorInvoiceBank : '',			// 开户银行
					operatorInvoiceAccount : '', 		// 银行账号
					operatorInvoiceTaxId : '',			// 纳税人识别号
					operatorInvoiceTitle : '',			// 发票抬头
					operatorPortraitUrl : '',    		// 头像
					operatorIdNumberUrl : '',			// 身份证正面
					operatorIdNumberUrl2 : '',			// 身份证反面
          companyBussinesscardUrl:"",   //名片
					operatorPostCode : '',				// 邮政编码
					companyAddress : '',				// 详细地址
					compantRemark : '',					// 备用信息
					provinceCode : '',					// 省份代码
					provinceName : '',					// 省份名称
					areaCode :[],  						//所属地区代码
					areaName : '',						// 地区名称
					companyFax : '',					// 传真
					companySocialCreditCodeUrl:'',		//社会信用代码证
					companyBusinessLicenceUrl : '',		// 营业执照
					companyTaxRegistrationUrl : '',		// 税务登记证
					companyOrganizationCodeUrl : '',	// 组织机构代码证
				},
		       ruleForm: { //地址信息
			          name: '',
			          khnumber:'',
			          region: '',
			          delivery: false,
			          resource: '',
			          desc: '',
			          value6:'',
			        },
		        detailedAreaList: [],
		        areaProps: {
					value: 'treeCode',
					children: 'children',
					label: 'treeName'
				},
				form:{
					youbian:'',
					chuanzhen:'',
				}
			}

		},
		methods: {
			systemTemplateAjax(){
				this.axios({
					method:"GET",
					url:"/v3/system/templates/00100000004"
				}).then((res)=>{
						this.helpData.templateName = res.data.templateName;
						this.helpData.templateRemark = res.data.templateRemark;
						this.helpData.questionAndAnswerArray = res.data.questionAndAnswerArray;
				}).catch((err)=>{
					this.Public.openError(this,err.response.data)
				})
			},

      		/* start uploadheadImg  */
    //------------------------头像上传 start--------------------------
			handleAvatarSuccess(res,file,fileList) {
				this.headerImg.uploading = false;
		      	this.headerImg.canUpload = true;
		      	this.headerImg.isImgSrc = true;
				this.headerImg.imgSrc = res;
			},
			handleAvatarError(err, file , fileList){
				this.headerImg.uploading = false;
		      	this.headerImg.canUpload = true;
		      	this.headerImg.isImgSrc = !!this.headerImg.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload(file) {
				this.headerImg.uploading = true;
		      	this.headerImg.canUpload = false;
		      	this.headerImg.isImgSrc = false;
		      	this.headerImg.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.headerImg.uploading = false;
			      	this.headerImg.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.headerImg.uploading = false;
			      	this.headerImg.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
			/* end uploadheadImg */
//------------------------头像上传 end--------------------------
//-----------------------/* start 身份证正面 */--------------------------
			handleAvatarSuccess1(res, file , fileList) {
				this.certificateImg1.fileListLength = fileList.length;
				console.log(fileList.length);
				this.certificateImg1.uploading = false;
		      	this.certificateImg1.canUpload = true;
		      	this.certificateImg1.isImgSrc = true;
				this.certificateImg1.imgSrc = res;
			},
			handleAvatarError1(err, file , fileList){
				this.certificateImg1.uploading = false;
		      	this.certificateImg1.canUpload = true;
		      	this.certificateImg1.isImgSrc = !!this.certificateImg1.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload1(file) {
				this.certificateImg1.uploading = true;
		      	this.certificateImg1.canUpload = false;
		      	this.certificateImg1.isImgSrc = false;
		      	this.certificateImg1.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg1.uploading = false;
			      	this.certificateImg1.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg1.uploading = false;
			      	this.certificateImg1.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------* end 身份证正面 * --------------------------

//-------------------*start 身份证反面 * --------------------------
			handleAvatarSuccess2(res, file , fileList) {
				this.certificateImg2.uploading = false;
		      	this.certificateImg2.canUpload = true;
		      	this.certificateImg2.isImgSrc = true;
				this.certificateImg2.imgSrc = res;
			},
			handleAvatarError2(err, file , fileList){
				this.certificateImg2.uploading = false;
		      	this.certificateImg2.canUpload = true;
		      	this.certificateImg2.isImgSrc = !!this.certificateImg2.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload2(file) {
				this.certificateImg2.uploading = true;
		      	this.certificateImg2.canUpload = false;
		      	this.certificateImg2.isImgSrc = false;
		      	this.certificateImg2.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg2.uploading = false;
			      	this.certificateImg2.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg2.uploading = false;
			      	this.certificateImg2.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------*end 身份证反面 * --------------------------

//-------------------*start 名片 * --------------------------
      handleAvatarSuccess7(res, file , fileList) {
        this.certificateImg7.uploading = false;
        this.certificateImg7.canUpload = true;
        this.certificateImg7.isImgSrc = true;
        this.certificateImg7.imgSrc = res;
      },
      handleAvatarError7(err, file , fileList){
        this.certificateImg7.uploading = false;
        this.certificateImg7.canUpload = true;
        this.certificateImg7.isImgSrc = !!this.certificateImg7.imgSrc;
        this.Public.openError(this,"上传失败");
      },
      beforeAvatarUpload7(file) {
        this.certificateImg7.uploading = true;
        this.certificateImg7.canUpload = false;
        this.certificateImg7.isImgSrc = false;
        this.certificateImg7.updata.fileName = file.name;

        const isJPG = file.type === 'image/jpeg';
        const isPNG = file.type === 'image/png';
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isJPG&&!isPNG) {
          this.certificateImg7.uploading = false;
          this.certificateImg7.canUpload = true;
          this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
        }
        if(!isLt2M) {
          this.certificateImg7.uploading = false;
          this.certificateImg7.canUpload = true;
          this.$message.error('上传图片大小不能超过 2MB!');
        }
        return (isPNG || isJPG) && isLt2M;
      },
//-------------------*end 名片 * --------------------------


//-------------------*start 营业执照 * --------------------------
			handleAvatarSuccess3(res, file , fileList) {
				this.certificateImg3.uploading = false;
		      	this.certificateImg3.canUpload = true;
		      	this.certificateImg3.isImgSrc = true;
				this.certificateImg3.imgSrc = res;
			},
			handleAvatarError3(err, file , fileList){
				this.certificateImg3.uploading = false;
		      	this.certificateImg3.canUpload = true;
		      	this.certificateImg3.isImgSrc = !!this.certificateImg3.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload3(file) {
				this.certificateImg3.uploading = true;
		      	this.certificateImg3.canUpload = false;
		      	this.certificateImg3.isImgSrc = false;
		      	this.certificateImg3.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg3.uploading = false;
			      	this.certificateImg3.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg3.uploading = false;
			      	this.headerImg.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------*end 营业执照 * --------------------------

//-------------------*start 税务登记证 * --------------------------
			handleAvatarSuccess4(res, file , fileList) {
				this.certificateImg4.uploading = false;
		      	this.certificateImg4.canUpload = true;
		      	this.certificateImg4.isImgSrc = true;
				this.certificateImg4.imgSrc = res;
			},
			handleAvatarError4(err, file , fileList){
				this.certificateImg4.uploading = false;
		      	this.certificateImg4.canUpload = true;
		      	this.certificateImg4.isImgSrc = !!this.certificateImg4.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload4(file) {
				this.certificateImg4.uploading = true;
		      	this.certificateImg4.canUpload = false;
		      	this.certificateImg4.isImgSrc = false;
		      	this.certificateImg4.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg4.uploading = false;
			      	this.certificateImg4.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg4.uploading = false;
			      	this.certificateImg4.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------*end 税务登记证 * --------------------------

//-------------------*start 组织机构代码证 * --------------------------
			handleAvatarSuccess5(res, file , fileList) {
				this.certificateImg5.uploading = false;
		      	this.certificateImg5.canUpload = true;
		      	this.certificateImg5.isImgSrc = true;
				this.certificateImg5.imgSrc = res;
			},
			handleAvatarError5(err, file , fileList){
				this.certificateImg5.uploading = false;
		      	this.certificateImg5.canUpload = true;
		      	this.certificateImg5.isImgSrc = !!this.certificateImg5.imgSrc;
		      	this.Public.openError(this,"图片上传失败");
			},
			beforeAvatarUpload5(file) {
				this.certificateImg5.uploading = true;
		      	this.certificateImg5.canUpload = false;
		      	this.certificateImg5.isImgSrc = false;
		      	this.certificateImg5.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg5.uploading = false;
			      	this.certificateImg5.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg5.uploading = false;
			      	this.certificateImg5.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------*end 组织机构代码证 * --------------------------

//-------------------*start 三证合一 * --------------------------
			handleAvatarSuccess6(res, file , fileList) {
				this.certificateImg6.uploading = false;
		      	this.certificateImg6.canUpload = true;
		      	this.certificateImg6.isImgSrc = true;
				this.certificateImg6.imgSrc = res;
			},
			handleAvatarError6(err, file , fileList){
				this.certificateImg6.uploading = false;
		      	this.certificateImg6.canUpload = true;
		      	this.certificateImg6.isImgSrc = !!this.certificateImg6.imgSrc;
		      	this.Public.openError(this,"上传失败");
			},
			beforeAvatarUpload6(file) {
				this.certificateImg6.uploading = true;
		      	this.certificateImg6.canUpload = false;
		      	this.certificateImg6.isImgSrc = false;
		      	this.certificateImg6.updata.fileName = file.name;

				const isJPG = file.type === 'image/jpeg';
		        const isPNG = file.type === 'image/png';
		        const isLt2M = file.size / 1024 / 1024 < 2;
				if (!isJPG&&!isPNG) {
					this.certificateImg6.uploading = false;
			      	this.certificateImg6.canUpload = true;
		        	this.Public.openError(this,"上传图片只能是 JPG和PNG 格式!")
		        }
				if(!isLt2M) {
					this.certificateImg6.uploading = false;
			      	this.certificateImg6.canUpload = true;
					this.$message.error('上传图片大小不能超过 2MB!');
				}
				return (isPNG || isJPG) && isLt2M;
			},
//-------------------*end 三证合一 * --------------------------


			namenull2(){
				if (this.basicMemberCompanyData.memberName=='') {
					this.goName=true
				} else{
					this.goName=false;
				}
			},

			namenull(){

			},
			//  验证邮箱格式
			valemail(){
				var ostr=this.basicMemberCompanyData.operatorEmail;
		      	var reg=/^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/;
		      	if (ostr!="") {
					if (reg.test(ostr) != true){
						this.oemail=true;
					}else{
						this.oemail=false;
					}
				}else{
					this.oemail=false;
				}
			},
			// 验证QQ格式
			varQq(){
				var ostr=this.basicMemberCompanyData.operatorQq;
		      	var reg=/[1-9]([0-9]{5,11})/;
				if (ostr!="") {
					if (reg.test(ostr) != true){
						this.oQq=true;
					}else{
						this.oQq=false;
					}
				}else{
					this.oQq=false;
				}


			},
//验证密码格式
			inpasswd() {
				var ostr = this.basicMemberCompanyData.operatorLoginPassword;
				var reg = /^[a-zA-Z0-9]{6,20}$/;
				if(reg.test(ostr) != true) {
					this.inpaww = true;
				} else {
					this.inpaww = false;
				}
			},
//验证两次密码是否一直
			inpasstwo() {
				if(this.basicMemberCompanyData.operatorLoginPassword == this.restwo) {
					this.intwo = false
				} else {
					this.intwo = true
				}
			},
//验证手机格式
			yanshouji() {
				var ostr = this.operatorPhone;
				var reg = /^1[34578]\d{9}$/;
				if(reg.test(ostr) != true) {
					this.inphone = true;
				} else {
					this.inphone = false;
				}
			},
//提交修改信息
			update() {
				if(this.signDate != null){
					this.basicMemberCompanyData.memberSignStartDate = this.signDate[0];
					this.basicMemberCompanyData.memberSignEndDate =  this.signDate[1];

				}
				if(!this.inphone) {
          this.clickBtn=!this.clickBtn;
					this.axios({
						method: 'PUT',
						url:"/v3/basic/members/updateCompany",
						data: {
							"memberCode" :this.basicMemberCompanyData.memberCode,										// 会员代码
							"memberName" : this.basicMemberCompanyData.memberName,										// 会员名称
							"gradeCode" : this.basicMemberCompanyData.gradeCode,										// 会员等级
							"regionCode" : this.basicMemberCompanyData.regionCode,										// 归属区域
							"memberSignStartDate" : this.basicMemberCompanyData.memberSignStartDate ,					// 签约开始时间
							"memberSignEndDate" : this.basicMemberCompanyData.memberSignEndDate,						// 签约结束时间
							"operatorName" : this.basicMemberCompanyData.operatorName,									// 姓名
							"operatorCode" : this.basicMemberCompanyData.operatorCode,									// 操作员代码
							"operatorTel" : this.basicMemberCompanyData.operatorTel,									// 电话
							"operatorQq" : this.basicMemberCompanyData.operatorQq,										// QQ
							"operatorEmail" : this.basicMemberCompanyData.operatorEmail,								// 邮箱
							"operatorPhone" : this.basicMemberCompanyData.operatorPhone,								// 手机
							"operatorAccount" : this.basicMemberCompanyData.operatorAccount,							// 登录账号
							"operatorLoginPassword" : this.basicMemberCompanyData.operatorLoginPassword,				// 登录密码
							"operatorInvoiceNane" : this.basicMemberCompanyData.operatorInvoiceNane,					// 开户名称
							"operatorInvoiceBank" : this.basicMemberCompanyData.operatorInvoiceBank,					// 开户银行
							"operatorInvoiceAccount" : this.basicMemberCompanyData.operatorInvoiceAccount, 				// 银行账号
							"operatorInvoiceTaxId" : this.basicMemberCompanyData.operatorInvoiceTaxId,					// 纳税人识别号
							"operatorInvoiceTitle" : this.basicMemberCompanyData.operatorInvoiceTitle,					// 发票抬头
							"operatorPortraitUrl" : this.headerImg.imgSrc,    											// 头像
							"operatorIdNumberUrl" : this.certificateImg1.imgSrc,										// 身份证正面
							"operatorIdNumberUrl2" : this.certificateImg2.imgSrc,										// 身份证反面
              "companyBussinesscardUrl" : this.certificateImg7.imgSrc,										// 名片
							"operatorPostCode" : this.basicMemberCompanyData.operatorPostCode,							// 邮政编码
							"companyAddress" : this.basicMemberCompanyData.companyAddress,								// 详细地址
							"compantRemark" : this.basicMemberCompanyData.compantRemark,								// 备用信息
							"provinceCode" : this.basicMemberCompanyData.provinceCode,									// 省份代码
							"provinceName" : this.basicMemberCompanyData.provinceName,									// 省份名称
							"areaCode" : JSON.stringify(this.basicMemberCompanyData.areaCode),							// 地区代码
							"areaName" : this.basicMemberCompanyData.areaName,											// 地区名称
							"companyFax" : this.basicMemberCompanyData.companyFax,										// 传真
							"companyBusinessLicenceUrl" : this.certificateImg3.imgSrc,									// 营业执照
							"companyTaxRegistrationUrl" : this.certificateImg4.imgSrc,									// 税务登记证
							"companyOrganizationCodeUrl": this.certificateImg5.imgSrc,									// 组织机构代码证
							"companySocialCreditCodeUrl":this.certificateImg6.imgSrc,									//信用证
						}
					}).then((res) => {
            this.clickBtn=!this.clickBtn;
							this.$notify({
								message: '操作成功！',
								type: 'success'
							});
							this.$router.push({path:"/enterprise"})
					}).catch((err)=>{
            this.clickBtn=!this.clickBtn;
            this.Public.openError(this,err.response.data);
          });
				} else {
					this.$notify.error({
						message: '请输入正确信息',
					});
				}
			},

//重置密码
			psatijiao() {
				this.axios({
					method: 'PUT',
					url: "/v3/member/operators/"+this.basicMemberCompanyData.operatorCode+"/"+ this.md5(this.basicMemberCompanyData.operatorLoginPassword).toUpperCase() +"/resettingPlatOperator",
					data:{
					}
				}).then((res) => {
					this.$notify({
						message: '操作成功！',
						type: 'success'
					});
					this.add=false
				}).catch((err)=>{
				    this.Public.openError(this,err.response.data)
			    });
			}	,

			areaChangeFn(val){
				this.basicMemberCompanyData.areaName="";
					switch(val.length){
						case 1:
							this.detailedAreaList.forEach((item,index,arr)=>{
								if(val[0] == item.treeCode){
									this.basicMemberCompanyData.areaName=item.treeName;
									return;
								}
							});
							break;
						case 2:
							this.detailedAreaList.forEach((item,index,arr)=>{
								if(val[0] == item.treeCode){
									this.basicMemberCompanyData.areaName=item.treeName;
									item.children.forEach((item1,index2,arr2)=>{
										if(val[1]==item1.treeCode){
											this.basicMemberCompanyData.areaName+="/"+item1.treeName;
										}
									})
								}
							});
							break;
						case 3:
							this.detailedAreaList.forEach((item,index,arr)=>{
								if(val[0] == item.treeCode){
									this.basicMemberCompanyData.areaName=item.treeName;
									item.children.forEach((item1,index1,arr1)=>{
										if(val[1]==item1.treeCode){
											this.basicMemberCompanyData.areaName+="/"+item1.treeName;
											item1.children.forEach((item2,index2,arr2)=>{
												if(val[2]==item2.treeCode){
													this.basicMemberCompanyData.areaName+="/"+item2.treeName;
												}
											})
										}
									})
								}
							});
							break;
						case 4:
							this.detailedAreaList.forEach((item,index,arr)=>{
								if(val[0] == item.treeCode){
									this.basicMemberCompanyData.areaName=item.treeName;
									item.children.forEach((item1,index1,arr1)=>{
										if(val[1]==item1.treeCode){
											this.basicMemberCompanyData.areaName+="/"+item1.treeName;
											item1.children.forEach((item2,index2,arr2)=>{
												if(val[2]==item2.treeCode){
													this.basicMemberCompanyData.areaName+="/"+item2.treeName;
													item2.children.forEach((item3,index3,arr3)=>{
														if(val[3]==item3.treeCode){
															this.basicMemberCompanyData.areaName+="/"+item3.treeName;
														}
													})
												}
											})
										}
									})
								}
							});
							break;
					}

				},

		},
		mounted() {
			/* 请求地区 */
			this.detailedAreaList = companyMsgDatas.areaData;
			var winHieg = document.documentElement.clientHeight;
			var cont = document.getElementById("content");
			cont.style.height = winHieg - 115 + "px";
			this.axios({
				method: 'GET',
				url: "/v3/basic/members/"+localStorage.getItem("memberCode")+"/queryCompanyData",
			}).then((res) => {
				if(res.data.state == res.data.success) {
					var data = res.data;
					console.log(res.data);
					if(data != null){
						// 分配数据到会员信息对象、操作员对象、公司对象信息中
						this.basicMemberCompanyData.memberName = data.memberName;						// 会员名称
						this.basicMemberCompanyData.memberCode = data.memberCode;						// 会员代码
						this.basicMemberCompanyData.gradeCode = data.gradeCode;							// 会员等级代码
						this.basicMemberCompanyData.regionCode = data.regionCode;
						this.basicMemberCompanyData.memberSignStartDate = data.memberSignStartDate;		// 签约开始时间
						this.basicMemberCompanyData.memberSignEndDate = data.memberSignEndDate;			// 签约结束时间
						this.basicMemberCompanyData.companyBusinessLicenceUrl = data.companyBusinessLicenceUrl;		// 营业执照
						this.basicMemberCompanyData.companyTaxRegistrationUrl = data.companyTaxRegistrationUrl;		// 税务登记证
						this.basicMemberCompanyData.companyOrganizationCodeUrl = data.companyOrganizationCodeUrl;	// 组织机构代码证
						this.basicMemberCompanyData.companySocialCreditCodeUrl = data.companySocialCreditCodeUrl;	// 信用证
						this.signDate = [data.memberSignStartDate,data.memberSignEndDate];
						// 操作员信息
						this.basicMemberCompanyData.operatorName = data.operatorName;						// 姓名
						this.basicMemberCompanyData.operatorCode = data.operatorCode;						// 操作员代码
						this.basicMemberCompanyData.operatorTel = data.operatorTel;							// 电话
						this.basicMemberCompanyData.operatorQq = data.operatorQq;							// QQ
						this.basicMemberCompanyData.operatorEmail = data.operatorEmail;						// 邮箱
						this.basicMemberCompanyData.operatorPhone = data.operatorPhone;						// 手机
						this.basicMemberCompanyData.operatorAccount = data.operatorAccount;					// 登录账号
						this.basicMemberCompanyData.operatorInvoiceNane = data.operatorInvoiceNane;			// 开户名称
						this.basicMemberCompanyData.operatorInvoiceBank = data.operatorInvoiceBank;			// 开户银行
						this.basicMemberCompanyData.operatorInvoiceAccount = data.operatorInvoiceAccount;	// 银行账号
						this.basicMemberCompanyData.operatorInvoiceTaxId = data.operatorInvoiceTaxId;		// 纳税人识别号
						this.basicMemberCompanyData.operatorInvoiceTitle = data.operatorInvoiceTitle;		// 发票抬头
						this.headerImg.imgSrc = data.operatorPortraitUrl;									// 头像
						this.basicMemberCompanyData.operatorIdNumberUrl = data.operatorIdNumberUrl;			// 身份证正面
						this.basicMemberCompanyData.operatorIdNumberUrl2 = data.operatorIdNumberUrl2;		// 身份证反面
            this.basicMemberCompanyData.companyBussinesscardUrl = data.companyBussinesscardUrl;		// 名片
						this.certificateImg1.imgSrc = data.operatorIdNumberUrl;								// 身份证正面
						this.certificateImg2.imgSrc = data.operatorIdNumberUrl2;             //身份证反面
            this.certificateImg7.imgSrc = data.companyBussinesscardUrl;             //身份证反面
						this.certificateImg3.imgSrc = data.companyBusinessLicenceUrl;						//营业照
						this.certificateImg4.imgSrc = data.companyTaxRegistrationUrl;						//税务证
						this.certificateImg5.imgSrc = data.companyOrganizationCodeUrl;						//组织正
						this.certificateImg6.imgSrc = data.companySocialCreditCodeUrl;						//信用证
						this.basicMemberCompanyData.operatorPostCode = data.operatorPostCode;				// 邮政编码
						// 企业公司信息
						this.basicMemberCompanyData.companyAddress = data.companyAddress;					// 详细地址
						this.basicMemberCompanyData.compantRemark = data.compantRemark;						// 备用信息
						this.basicMemberCompanyData.provinceCode = data.provinceCode;						// 省份代码
						this.basicMemberCompanyData.provinceName = data.provinceName;						// 省份名称
						this.basicMemberCompanyData.areaCode = data.areaCode?JSON.parse(data.areaCode):[];								// 地区代码
						this.basicMemberCompanyData.areaName = data.areaName;								// 地区名称
						this.basicMemberCompanyData.companyFax = data.companyFax;					// 传真
					}

				} else {}
			});
			// 获取会员级别
	      	this.axios({
				method: 'post',
				url:"/v3/member/grades/listAll",
				data:{}
			}).then((res) => {
					this.options = res.data.list;
					for(var i = 0 ; i < res.data.list.length;i++){
						if(res.data.list[i].gradeDefault == '1'){
							this.gradeCode=res.data.list[i].gradeCode;
							break;
						}
					}
			}).catch((err)=>{
				this.Public.openError(this,err.response.data)
			});
			// 获取区域
	      	this.axios({
				method: 'post',
				url:"/v3/basic/regions/listAll",
				data:{}
			}).then((res) => {
					this.options2 = res.data.list;
			}).catch((err)=>{
				this.Public.openError(this,err.response.data)
			});
			//帮助功能
			this.systemTemplateAjax();
		},
	}
</script>

<style scoped>
	@import "../../../assets/css/zijin.css";

	/*body{
			overflow-y: auto!important;
		}*/

	.location {
		padding: 3px 0 15px 0;
	}

	.content {
		background: #fff;
		padding: 15px;
		overflow: auto!important;
		font-family: "微软雅黑";
		position: relative;
		overflow: auto;
		min-width: 1330px;
	}

	.per-left {
		margin-left: 46px;
		float: left;
	}

	.per-left li {
		height: 55px;
		text-align: right;
	}

	.per-left li input {
		text-indent: 5px;
		height: 32px;
		border-radius: 4px;
		border: 1px solid #cdd9e6;
	}

	.per-left li em,
	.accoUL li em {
		color: #f50;
	}

	.per-left li span {
		margin-right: 8px;
	}

	.per-left li .inptwid {
		width: 496px;
	}
	.per-left li .inptdun {
		width: 210px;
	}

	.personal {
		margin-top: 20px;
	}
	/*上传头像*/
	.avatar-uploader {
		display: inline;
	}
.avatar-uploader .el-upload {
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #20a0ff;
  }
  .avatar-uploader.uploading .el-upload{
  	border: 1px dashed #d9d9d9;
  }
  .avatar-uploader-icon {
  	border: 1px dashed #d9d9d9;
    font-size: 28px;
    color: #8c939d;
    width: 110px;
    height: 110px;
    line-height: 110px;
    text-align: center;
  }
  .uploading .avatar-uploader-icon{
  	border-color: transparent;
  }
  .avatar {
    width: 110px;
    height: 110px;
    display: block;
    border-radius: 6px;
  }
  .avatar-shenfen-uploader .avatar {
    width: 220px;
    height: 125px;
    display: block;
  }
	/*end*/
	.per-right {
		width: 300px;
		margin-left: 130px;
		float: left;
	}
	.per-right span {
		float: left;
		margin-right: 16px;
	}
	.persZh {
		clear: both;
		margin-left: 29px;
		margin-top: 20px;
		height: 128px;
	}
	.perSpan {
		float: left;
	}
	.el-upload {
		float: left;
	}
	.shenfen {
		width: 460px;
		float: left;
	}
	.el-upload--picture-card {
		width: 125px;
		height: 125px;
		line-height: 125px;
	}
	.accoUL {
		text-align: right;
		width: 579px;
		margin-top: 20px;
	}
	.accoUL input {
		width: 476px;
		text-indent: 5px;
		height: 32px;
		border-radius: 4px;
		border: 1px solid #cdd9e6;
	}
	.accoUL li span {
		margin-right: 10px;
	}
	.accoUL li {
		height: 60px;
	}
	.account {
		margin-top: 20px;
	}
	.account .accoUL-li {
		text-align: left;
		text-indent: 80px;
		height: 40px;
	}
	.accoUL-li span {
		display: inline-block;
		text-indent: 0;
		text-align: center!important;
		width: 120px;
		height: 20px;
		line-height: 22px;
		background: #e9ecf3;
		color: #fff;
		margin-right: 3px!important;
		font-size: 13px;
	}
	.accoUL p {
		color: #f50;
	}
	.accoULzhang{
		width: 452px;
	}
	.accoULzhang input{
		width: 370px;
	}
	.queren {
    position: fixed;
    bottom: 0px;
    margin-left: -15px;
    width: 87%;
    background: #fff;
    height: 80px;
	}
	.queren a {
    display: inline-block;
    height: 32px;
    line-height: 32px;
    background: #fff!important;
    border: 1px solid #cdd9e6;
    color: #666!important;
    width: 80px;
    border-radius: 20px;
    text-align: center;
    margin-top: 20px;
    margin-right: 20px;
    box-sizing: border-box;
	}
	.queren .baocun {
    color: #fff!important;
    background: #13C19F!important;
    z-index: 100;
    cursor: pointer;
    border: 0;
    margin-left: 30px;
	}
	.specific-search {
		position: fixed;
		width: 87%;
		top: 80px;
		left: 180px;
		padding: 30px;
		z-index: 1005;
		background: #fff;
		box-sizing: border-box;
		box-shadow: 0 0 10px #ccc;
	}
	.search-title {
		font-size: 16px;
		border: 0;
		color: #415161;
	}
	.form {
		width: 1000px;
		background: #fff;
		margin: 20px 0;
	}
	.search-btn {
		margin-top: 70px;
	}
	.specific-search {}
	.fade-enter-active,.fade-leave-active {
		transition: .4s;
	}
	.fade-enter,.fade-leave-active {
		opacity: 0;
	}

	.slideDown-enter-active,.slideDown-leave-active {
		transition: .4s;
	}
	.slideDown-enter,.slideDown-leave-active {
		height: 0;
		opacity: 0;
	}
	.content input:hover {
		border-color: #03B8CC;
		transition: 0.5s;
	}
	.caiwu{
		overflow: hidden;
	}
	.gosi-dox{
		margin-top: 20px;
		margin-bottom: 60px;
		overflow: hidden;
	}
	.gosi-left1{
		float: left;
		width: 600px;
	}
	.gosi-right{
		float: left;
		width: 600px;
	}
	.text-qq{
		float: left;margin-left: 18px;margin-right: 42px;
	}
	.sanzheng{
		margin-top: 40px;
		margin-left: -46px;
	}
	.persan{
		margin-top: 40px;
		margin-left: 40px;
	}
	.gosi-left1 input{
		width: 498px;
		border: 1px solid #cdd9e6 ;
		height: 36px;
		box-sizing: border-box;
		border-radius:4px ;
		text-indent: 8px;
		margin-left: 8px;
	}
	.gosi-left1{
		text-align: right;
	}
	.gosi-left1 li{
		height: 60px;
	}
	.gosi-left1 em{
		color: #f50;
	}
	.qiyekehuli{
		text-align: right;
	}
	.qiyekehuli input{
		width: 198px;
		float: left;
	}
	.qiyekehuli span{
		margin-left: 70px;
		float: left;
		line-height: 36px;
	}
</style>
